import { createApp } from 'vue'
import App from '@/App.vue'
let app = createApp(App)
import '@/style.css'
import '@/css/common.css'
// 导入elemen-plus全部组件
// 导入element-plus全部组件样式
// import ElementPlus from 'element-plus'
// import 'element-plus/dist/index.css'
// 全局注册路由
// import { useRouter } from 'vue-router'
// app.config.globalProperties.$router = useRouter()
// 全局注册插件
// app.use(ElementPlus)
// import utils from '@/utils/utils'
// app.use(utils)
// 全局引入接口
// import api from '@/api/views/index.js'
// 全局引入方法函数
import { globalRegisterProperties } from '@/global'
app.use(globalRegisterProperties)
import router from '@/router/index.js'
app.use(router)
import {createPinia} from 'pinia'
const pinia = createPinia()
app.use(pinia)
// 引入所有的图标并注册，全局使用
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
// 全局引入自定义指令
import { globalRegisterDrective } from '@/drective'
app.use(globalRegisterDrective)
// import '@/drective'
// 定义自定义指令
// app.directive('d-permission', {
//   // 当被绑定的元素挂载到 DOM 中时调用
//   mounted(el, binding) {
//     // 这里你可以对元素进行操作，例如添加事件监听器、修改样式等
//     console.log('permission=>元素已挂载:', el);
//     console.log('permission=>指令的绑定值:', binding.value);
//   },
  
//   // 当指令所在组件更新时调用
//   updated(el, binding) {
//     // 这里你可以根据绑定值更新元素的状态或行为
//     console.log('元素已更新:', el);
//     console.log('新的绑定值:', binding.value);
// 		el.style.background = binding.value.background
//   },
  
//   // 其他选项如 `beforeMount`, `beforeUpdate`, `beforeUnmount` 等可以根据需要定义
// });
// 引入echarts
import echarts from '@/utils/echarts.js'
app.use(echarts)
app.config.globalProperties.$echarts = echarts;//vue3的挂载方式
app.provide('$echarts', echarts); // vue3采用provide, inject方式使用
app.mount('#app')
